<template>
    <div>
        <el-form :model="form" :rules="rules" ref="form" label-width="100px" class="demo-form">
            <el-row>
                <el-col :span="12">
                    <el-form-item label="登录名称" prop="loginName">
                        <el-input v-model="form.loginName"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="密码" prop="loginPassword">
                        <el-input v-model="form.loginPassword" show-password clearable></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="用户名称" prop="userName">
                        <el-input v-model="form.userName"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="用户手机号" prop="userPhone">
                        <el-input v-model="form.userPhone"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="性别" prop="userSex" style="float: left">
                        <el-radio v-model="form.userSex" label="1">男</el-radio>
                        <el-radio v-model="form.userSex" label="2">女</el-radio>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="用户生日" prop="userBirthday" style="float: left">
                        <el-date-picker v-model="form.userBirthday" type="date" placeholder="选择日期">
                        </el-date-picker>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="用户类型" prop="userType">
                        <el-input v-model="form.userType"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="成长值" prop="userGrowthValue">
                        <el-input v-model="form.userGrowthValue"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="可用实冲余额" prop="userNetbalance">
                        <el-input v-model="form.userNetbalance"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="可用赠送余额" prop="userGiftbalance">
                        <el-input v-model="form.userGiftbalance"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="可用积分" prop="userAvailableintegral">
                        <el-input v-model="form.userAvailableintegral"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="地址" prop="userAdressPC">
                        <el-input v-model="form.userAdressPC"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="24">
                    <el-form-item label="详细地址" prop="userDetailAddress">
                        <el-input type="textarea" v-model="form.userDetailAddress"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
    </div>
</template>

<script>
import { Registers } from "@/api/user";
export default {
    data() {
        return {
            dialogTableVisible: false,
            dialogFormVisible: false,
            form: {},
            rules: {
                loginName: [
                    { required: true, message: '请输入登录名称', trigger: 'blur' }
                ],
                loginPassword: [
                    { required: true, message: '请输入密码', trigger: 'blur' }
                ],
                userName: [
                    { required: true, message: '请输入用户名称', trigger: 'blur' }
                ],
                userPhone: [
                    { required: true, message: '请输入用户手机号', trigger: 'blur' }
                ],
                userBirthday: [
                    { required: true, message: '请输入用户生日', trigger: 'blur' }
                ],
                userType: [
                    { required: true, message: '请输入用户类型', trigger: 'blur' }
                ],
                userGrowthValue: [
                    { required: true, message: '请输入成长值', trigger: 'blur' }
                ],
                userNetbalance: [
                    { required: true, message: '请输入可用实冲余额', trigger: 'blur' }
                ],
                userGiftbalance: [
                    { required: true, message: '请输入可用赠送余额', trigger: 'blur' }
                ],
                userAvailableintegral: [
                    { required: true, message: '请输入可用积分', trigger: 'blur' }
                ],
                userSex: [
                    { required: true, message: '请选择性别', trigger: 'change' }
                ],
                userBirthday: [
                    { required: true, message: '请输入生日', trigger: 'blur' }
                ],
                userAdressPC: [
                    { required: true, message: '请输入地址', trigger: 'blur' }
                ],
                userDetailAddress: [
                    { required: true, message: '请输入详细地址', trigger: 'blur' }
                ]
            }
        };
    },
    methods: {
        //注册
        register(formName) {
            this.$refs[formName].validate((valid) => {
                if (valid) {
                    Registers(this.form).then((res) => {
                        if (res.data) {
                            this.$message.success("注册成功");
                            this.dialogFormVisible = false;
                            return;
                        } else {
                            this.$message.success("注册失败");
                            return;
                        }
                    });
                } else {
                    return false;
                }
            });
        },
    },
}
</script>

<style></style>